<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/resources/js/jquery-1.11.1.min.js"></script>
    <script src="/resources/js/self.js"></script>
    <script type="text/javascript" src="/resources/My97DatePicker/WdatePicker.js"></script>
    <script type="text/javascript" src="/resources/js/ajaxfileupload.js"></script>
    <script type="text/javascript" src="/resources/js/Util.js"></script>
</head>
<body>
<div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="x_title">
                <h2>商品 <small>维护</small></h2>
                <ul class="nav navbar-right panel_toolbox">
                    <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                            <li><a href="#">Settings 1</a>
                            </li>
                            <li><a href="#">Settings 2</a>
                            </li>
                        </ul>
                    </li>
                    <li><a class="close-link"><i class="fa fa-close"></i></a>
                    </li>
                </ul>
                <div class="clearfix"></div>
            </div>
            <div class="x_content">
                <br>
                <div id="demo-form2"  class="form-horizontal form-label-left" >
                    <input type="hidden" id="id" name="id" class="form-data" >
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">产品名称
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input type="text"  id="name" name="name"
                                   class="form-control form-data col-md-7 col-xs-12" >
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="rootClazzId">品牌
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <select name="brandId" id="brandId" class="form-control form-data" >
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="rootClazzId">总分类
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <select name="rootClazzId" id="rootClazzId" class="form-control form-data" >
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="clazzId">分类
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <select name="clazzId" id="clazzId" class="form-control form-data" >
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="imgDiv">商品头图
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input type="file" name="file" multiple="true" accept="image/*" id="fileUpload" style="float:left"
                                   onchange="uploadFile('fileUpload','image', 'imgDiv', 200, '','image')"/>
                            <div id="imgDiv" style="padding-top: 43px">
                                <img src="" style="cursor: pointer; width:200px;" onclick="deleteImage(event,this)" title="右键删除" />
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">规格</label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input name="id" class="norm" type="hidden">
                            <input type="text"  name="name"
                                   class="form-control norm col-md-7 col-xs-12" style="width:20% !important;">
                            <input type="text"  name="values"
                                   class="form-control norm col-md-7 col-xs-12" style="width:80% !important;">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="unit">计量单位
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input type="text"  id="unit" name="unit"
                                   class="form-control form-data col-md-7 col-xs-12" >
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">状态</label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input style="width:15px;height:15px" type="radio" name="status" class="form-data" value="valid" />
                            <span>有效</span>
                            <input style="width:15px;height:15px" type="radio" name="status" class="form-data" value="invalid"/>
                            <span>无效</span>
                        </div>
                    </div>
                    <div class="form-group content">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12">简介
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <textarea id="editor_id" class="form-control form-data" name="content" rows="3" placeholder=""></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3 col-sm-3 col-xs-12" for="name">货码
                        </label>
                        <div class="col-md-6 col-sm-6 col-xs-12">
                            <input type="text" id="code" name="code"
                                   class="form-control form-data col-md-7 col-xs-12" >
                        </div>
                    </div>
                    <div class="ln_solid"></div>
                    <div class="form-group">
                        <div class="col-md-6 col-sm-6 col-xs-12 col-md-offset-3">

                            <button onclick="save()" class="btn btn-success">提交</button>
                            <button onclick="back()" class="btn btn-primary" type="button">取消</button>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function () {
        buildSelectForPage();
        $("#rootClazzId").change(function () {
            var rootClazz = $(this).children('option:selected').attr("b-data");
            initSelect("#clazzId",JSON.parse(rootClazz).subList,"id","name");
        });
        initData();
    });
    function buildSelectForPage() {
        $.ajax({
            url:"/admin/classification/treeMap.do",
            data:{},
            type:'post',
            async:false,
            dataType:'json',
            success:function(data){
                if(data.success){
                    initSelect("#rootClazzId",data.data,"id","name");
                    initSelect("#clazzId",data.data[0].subList,"id","name");
                }
            }
        });
        $.ajax({
            url:"/admin/brand/list.do",
            data:{},
            type:'post',
            async:false,
            dataType:'json',
            success:function(data){
                if(data.success){
                    initSelect("#brandId",data.data,"id","name");

                }
            }
        });
    }
    function initData(){
        var data = getData();
        var id = data.id;
        if(null2empty(id) !==""){
            $("#id").val(id);
            $.ajax({
                url:"/admin/product/find.do",
                data:{'id':id},
                type:'post',
                dataType:'json',
                success:function(data){
                    console.log(data);
                    if(data.success){

                        initPageDate(data.data, '.form-data');
                        if(!isNullOrUndefined(data.data.productNorm)){
                            initPageDate(data.data.productNorm, '.norm');
                        }
                        $("#imgDiv img").attr("src",data.data.image);
                        var rootClazz = $("#rootClazzId").children('option:selected').attr("b-data");
                        initSelect("#clazzId",JSON.parse(rootClazz).subList,"id","name");
                        /*if(!isNullOrUndefined(data.data.icon)){
                         var imgArray =  new Array();
                         imgArray.push({"id":data.data.icon,"path":data.data.icon});
                         addFileInfoToTable(imgArray);
                         }*/
                    }
                }
            });
        }

    }

    function save() {
        var params = getPageDataByClass("form-data");
        var norm =  getPageDataByClass("norm");
        if(!isNullOrUndefined(norm["name"])){
            params["productNorm"] = norm;
        }
        debugger
        if (strIsNull(params['name'])) {
            alert("请输入商品名称");
            return;
        }
        var img = $("#imgDiv img");
        if(img.length > 0) {
            params['image'] = $(img[0]).attr("src");
        }else{
            alert("请上传图片");
            return;
        }
        $.ajax({
            url: "/admin/product/save.do",
            data: JSON.stringify(params),
            dataType: 'json',
            contentType: 'application/json;charset=utf-8',
            type: 'post',
            success: function (data) {
                console.log(data);
                if (data.success) {
                    alert("保存成功");
                    goto("product_list.html");
                } else {
                    alert(data.msg);
                }
            }
        });
    }
    function back() {
        goto("product_list.html");
    }
</script>
</html>